<div class="rt-nav-warning-container" ng-if="ctrl.datasourceUpgrader.needsUpgrade()">
  <i class="icon-gf icon-gf-alert rt-nav--warning-icons-alert"></i>
  <span>worldPing now supports Grafana Alerting!</span>
  <span class="rt-nav--warning-subcopy">To start using alerting, an update to your worldPing data source <strong>is required</strong>.</span>
  <a href="#" class="btn btn-inverse btn-small" ng-if="ctrl.datasourceUpgrader.canUpgrade()" ng-click="ctrl.datasourceUpgrader.upgrade()">Update now</a>
  <div class="rt-nav--warning-subcopy" ng-if="!ctrl.datasourceUpgrader.canUpgrade()">Please contact your admin to have them perform the update.</div>
</div>
<div ng-if="ctrl.endpoints.length > 0" class="rt-nav">
    <div class="rt-nav-header" ng-repeat="endpoint in ctrl.endpoints | filterByTag:ctrl.filter.tag | orderBy:ctrl.sort_field">
        <div>
            <div class="rt-nav-breadcrumb">
                <a href="dashboard/db/worldping-home" class="freqMsg disabled">
                    <img src="public/plugins/raintank-worldping-app/img/worldPing-grey.svg" height="30"> >
                </a>
                <span class="rt-list-item-title" style="margin: 2px;"><a href="plugins/raintank-worldping-app/page/endpoint-details?endpoint={{endpoint.id}}">{{endpoint.name}}</a></span>
                <div style="display: inline-block;">
                    <span class="label rt-label-tag dropdown rt-list-tag-menu" ng-repeat="tag in endpoint.tags" tag-color-from-name="tag"> <span>{{tag}} <i ng-class="icon" class="tag-icon icon-rt-endpoint-tiny"></i></a>
                    </span>
                </div>
            </div>
            <div style="float: right;">
                <div style="display: inline;">
                    <rt-endpoint-health-dashboard endpoint="endpoint" ctrl="ctrl"></rt-endpoint-health-dashboard> <span class="pipe-separator"> | </span>
                </div>
                <div style="display: inline;">
                    <a ng-href="plugins/raintank-worldping-app/page/endpoint-details?endpoint={{endpoint.id}}" class="rt-health-list small">Details <i ng-class="icon" class="icon-rt-endpoint rt-nav-icon-font"></i></a> <span class="pipe-separator"> | </span>
                    <a ng-href="plugins/raintank-worldping-app/page/endpoint-config?endpoint={{endpoint.id}}" class="rt-health-list small">Configure <i ng-class="icon" class="icon-rt-settings rt-nav-icon-font"></i></a>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
    <div class="rt-nav-hr">
    </div>
</div>

<div ng-if="ctrl.pageReady && !ctrl.endpoints.length && !ctrl.isGoogleDemo" class="rt-nav rt-nav--background">
  <div class="rt-nav-header">
    <div class="wp-nav-no-endpoints">
      <span class="rt-nav-header--message"><i class="icon-gf icon-gf-skull rt-nav-icon"></i>This slug is not active and will automatically be removed after 72hrs of inactivity. <a href="mailto:support@grafana.com?subject=Request to delete {{ctrl.endpointSlugs[0]}}">Questions?</a></span>
    </div>
    <div class="clearfix"></div>
  </div>
</div>

<div ng-if="ctrl.pageReady && ctrl.isGoogleDemo" class="rt-nav rt-nav--background">
  <div class="rt-nav-header">
    <div class="wp-nav-no-endpoints">
      <span class="rt-nav-header--message">This is live test data, but it doesnt have to be.</span>
      <a class="btn btn-success btn-small rt-nav-header--button" href="plugins/raintank-worldping-app/page/endpoint-config">
        <i class="fa fa-plus"></i>
        Add an endpoint
      </a>
    </div>
    <div class="clearfix"></div>
  </div>
</div>
